Motion >> Repos - motion-next.git/blob

   1 <md-dialog
   2   class="report-selection-dialog"
   3   aria-label="Report Selection"
   4   flex="60"
   5 >
   6   <md-toolbar>
   7     <div class="md-toolbar-tools">
   8       <h2>Select Report</h2>
   9       <span flex></span>
  10       <md-button class="md-icon-button" ng-click="vm.closeReportDialog()">
  11         <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
  12       </md-button>
  13     </div>
  14   </md-toolbar>
  15
  16   <md-dialog-content>
  17     <div
  18       class="content"
  19       md-background-bg
  20       layout="row"
  21       layout-align="start start"
  22     >
  23       <div layout="column" flex="30">
  24         <md-card class="padding-10 scrollable" ms-scroll>
  25           <div
  26             js-tree="vm.treeConfig"
  27             tree-events-obj="vm.treeDefaultEvents"
  28             ng-model="vm.treeDefaultData"
  29             tree="vm.treeDefaultInstance"
  30           ></div>
  31         </md-card>
  32         <md-card class="padding-10 scrollable" ms-scroll>
  33           <div
  34             js-tree="vm.treeConfig"
  35             tree-events-obj="vm.treeCustomEvents"
  36             ng-model="vm.treeCustomData"
  37             tree="vm.treeCustomInstance"
  38           ></div>
  39         </md-card>
  40       </div>
  41       <md-card flex="70">
  42         <md-toolbar class="md-table-toolbar md-default">
  43           <div class="md-toolbar-tools">
  44             <span class="h2 secondary-text">{{vm.currentNode.text}}</span>
  45             <p ng-if="vm.currentPath">
  46               <span class="text-boxed">{{vm.currentPath}}</span>
  47             </p>
  48           </div>
  49         </md-toolbar>
  50         <md-table-container>
  51           <table
  52             md-table
  53             md-row-select
  54             ng-model="vm.selectedReport"
  55             md-progress="vm.promise"
  56           >
  57             <thead
  58               md-head
  59               md-order="vm.query.sort"
  60               md-on-reorder="vm.getReports"
  61             >
  62               <tr md-row>
  63                 <th md-column md-order-by="id" width="10px">
  64                   {{ "ANALYTICS.ID" | translate }}
  65                 </th>
  66                 <th md-column md-order-by="name">
  67                   {{ "ANALYTICS.NAME" | translate }}
  68                 </th>
  69                 <th md-column md-order-by="description">
  70                   {{ "ANALYTICS.DESCRIPTION" | translate }}
  71                 </th>
  72                 <th md-column md-order-by="createdAt">
  73                   {{ "ANALYTICS.CREATED_AT" | translate }}
  74                 </th>
  75               </tr>
  76             </thead>
  77             <tbody md-body>
  78               <tr md-row ng-hide="vm.reports.rows.length">
  79                 <td md-cell colspan="5">
  80                   <div layout="row" layout-align="center center">
  81                     <span translate="ANALYTICS.NO_AVAILABLE_INFO"
  82                       >No Available Info</span
  83                     >
  84                   </div>
  85                 </td>
  86               </tr>
  87               <tr
  88                 md-row
  89                 md-select="report"
  90                 md-select-id="id"
  91                 ng-repeat="report in vm.reports.rows"
  92               >
  93                 <td md-cell class="id">{{ report.id }}</td>
  94                 <td md-cell class="name">{{ report.name }}</td>
  95                 <td md-cell class="description">{{ report.description }}</td>
  96                 <td md-cell class="createdAt">
  97                   {{ report.createdAt | date: "medium" }}
  98                 </td>
  99               </tr>
 100             </tbody>
 101           </table>
 102         </md-table-container>
 103
 104         <md-table-pagination
 105           md-label="{page: '{{ 'ANALYTICS.PAGE' | translate }}:', rowsPerPage: '{{ 'ANALYTICS.ROWSPERPAGE' | translate }}:', of: '{{ 'ANALYTICS.OF' | translate }}'}"
 106           md-limit="vm.query.limit"
 107           md-limit-options="[10]"
 108           md-page="vm.query.page"
 109           md-total="{{ vm.reports.count }}"
 110           md-on-paginate="vm.getReports"
 111           md-page-select
 112         ></md-table-pagination>
 113       </md-card>
 114     </div>
 115   </md-dialog-content>
 116   <md-dialog-actions layout="row">
 117     <span flex></span>
 118     <md-button class="md-raised" ng-click="vm.closeReportDialog()"
 119       >CANCEL</md-button
 120     >
 121     <md-button class="md-accent md-raised" ng-click="vm.selectReport()"
 122       >CONFIRM</md-button
 123     >
 124   </md-dialog-actions>
 125 </md-dialog>